<%--
  index.jsp
  作用：网站的首页，展示所有上架商品列表和分页导航。
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>首页 - 沈阳工程学院二手交易</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/css/layout.css">
</head>
<body>

    <div class="main-container">
        
        <jsp:include page="/WEB-INF/parts/sidebar.jsp" />

        <main class="content-area">
            
            <jsp:include page="/WEB-INF/parts/header.jsp" />

            <div class="search-bar">
                <form action="${pageContext.request.contextPath}/index" method="get">
                    <input type="text" name="keyword" placeholder="搜索商品名称或描述..." value="<c:out value="${keyword}" />">
                    <button type="submit" class="btn-search">搜索</button>
                </form>
            </div>

            <div class="product-grid">
                <c:forEach var="product" items="${products}">
                    <div class="product-card">
                        <div class="product-image">
                            <img src="${pageContext.request.contextPath}/uploads/product_images/${product.imageUrl}" alt="${product.name}">
                        </div>
                        <div class="product-info">
                            <h4 class="product-name">${product.name}</h4>
                            <p class="product-price">¥ ${product.price}</p>
                            <div class="product-actions">
                                <a href="${pageContext.request.contextPath}/product?id=${product.id}" class="btn-detail">查看详情</a>
                                <a href="${pageContext.request.contextPath}/buy?id=${product.id}" class="btn-buy">购买</a>
                            </div>
                        </div>
                    </div>
                </c:forEach>
                 <c:if test="${empty products}">
                    <p class="empty-message">现在还没有商品哦，快去发布一个吧！</p>
                </c:if>
            </div>

            <div class="pagination">
                <c:if test="${currentPage > 1}">
                    <a href="?page=${currentPage - 1}<c:if test='${not empty keyword}'>&keyword=<c:out value="${keyword}" /></c:if>">&laquo; 上一页</a>
                </c:if>
                <c:if test="${totalPages > 0}">
                    <span>第 ${currentPage} / ${totalPages} 页</span>
                </c:if>
                <c:if test="${currentPage < totalPages}">
                    <a href="?page=${currentPage + 1}<c:if test='${not empty keyword}'>&keyword=<c:out value="${keyword}" /></c:if>">下一页 &raquo;</a>
                </c:if>
            </div>
        </main>
    </div>

</body>
</html>
